<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>媒体对象</title>
		<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
		<script src="js/jquery-2.1.1.min.js" type="text/javascript" charset="utf-8"></script>
	 	<script src="js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<style>
			body{
				margin: 10px 0;
			}
		</style>
		<!--
        	作者：zxy
        	时间：2019-07-27
        	描述：用div的方式创建媒体对象
        -->
		<div class="container">
			<div class="media">
				<a class="media-left" href="#">
					<img src="img/4.png" alt=""  />
				</a>
				<div class="media-body">
					<h4 class="media-heading">欢迎来到德玛西亚</h4>
					<p>啦啦啦啦啦啦啦啦啦啦啦啦啦绿绿绿绿绿绿绿绿绿
					啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦
					了啦啦啦啦啦啦啦啦绿绿绿绿绿
					<br>
					lall啦啦啦啦啦啦啦啦绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿
					啦啦啦啦啦啦啦啦啦啦啦绿绿绿绿绿绿绿绿
					啦啦啦啦啦啦啦啦啦啦啦绿绿绿绿绿绿绿绿啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦</p>
					
					
					<div class="media">
						<a class="media-left media-middle" href="#">
							<img src="img/4.png" alt=""  />
						</a>
						<div class="media-body">
							<h4 class="media-heading">欢迎来到德玛西亚</h4>
							<p>啦啦啦啦啦啦啦啦啦啦啦啦啦绿绿绿绿绿绿绿绿绿
							啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦
							了啦啦啦啦啦啦啦啦绿绿绿绿绿
							<br>
							lall啦啦啦啦啦啦啦啦绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿
							啦啦啦啦啦啦啦啦啦啦啦绿绿绿绿绿绿绿绿
							啦啦啦啦啦啦啦啦啦啦啦绿绿绿绿绿绿绿绿啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦</p>
						</div>
					</div>
				</div>
			</div>
			
			
			
			<div class="media">
				<a class="media-left media-bottom" href="#">
					<img src="img/4.png" alt=""  />
				</a>
				<div class="media-body">
					<h4 class="media-heading">欢迎来到德玛西亚</h4>
					<p>啦啦啦啦啦啦啦啦啦啦啦啦啦绿绿绿绿绿绿绿绿绿
					啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦
					了啦啦啦啦啦啦啦啦绿绿绿绿绿
					<br>
					lall啦啦啦啦啦啦啦啦绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿
					啦啦啦啦啦啦啦啦啦啦啦绿绿绿绿绿绿绿绿
					啦啦啦啦啦啦啦啦啦啦啦绿绿绿绿绿绿绿绿啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦</p>
				</div>
			</div>
			
			
			<div class="media">
				
				<div class="media-body">
					<h4 class="media-heading">欢迎来到德玛西亚</h4>
					<p>啦啦啦啦啦啦啦啦啦啦啦啦啦绿绿绿绿绿绿绿绿绿
					啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦
					了啦啦啦啦啦啦啦啦绿绿绿绿绿
					<br>
					lall啦啦啦啦啦啦啦啦绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿
					啦啦啦啦啦啦啦啦啦啦啦绿绿绿绿绿绿绿绿
					啦啦啦啦啦啦啦啦啦啦啦绿绿绿绿绿绿绿绿啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦</p>
				</div>
				
				<a class="media-right" href="#">
					<img src="img/4.png" alt=""  />
				</a>
			</div>
		</div>
	</body>
</html>
